import QtQuick 2.0

Rectangle{
    width: 320; height: 240
    color: "#c0c0c0"

    Text {
        id: coloredText
        text: qsTr("Hello World")
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.top: parent.top
        anchors.topMargin: 4
        font.pixelSize: 32
    }
    Component{
        id: colorComponent
        Rectangle{
            id: colorPicker
            width: 50; height: 30
            signal colorPicked(color clr)
            MouseArea{
                anchors.fill: parent
                onPressed: colorPicker.colorPicked(colorPicker.color)
            }
        }
    }

    Loader{
        id: blueLoader
        anchors.left: redLoader.right
        anchors.leftMargin: 4
        anchors.verticalCenter: redLoader.verticalCenter
        sourceComponent: colorComponent
        onLoaded: {
            item.color = "blue"
        }
    }

    Loader{
        id: redLoader
        anchors.left: parent.left
        anchors.leftMargin: 4
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 4
        sourceComponent: colorComponent
        onLoaded: {
            item.color = "red"
        }
    }
    Connections{
        target: blueLoader.item
        onColorPicked:{
            coloredText.color = clr
        }
    }
    Connections{
        target: redLoader.item
        onColorPicked:{
            coloredText.color = clr
        }
    }
}


















